<template>
  <Card>
    <div slot="title">
      <span style="line-height:32px; height:32px;">部门</span>
      <Button @click="refreshDeptList" style="float:right"><Icon type="ios-refresh" />刷新</Button>
    </div>
    <PickTree
    :data="deptData"
    :labelKey="deptTreeLabelKey"
    :valueKey="deptTreeValueKey"
    @on-select-change='onSelectDeptChange'
    />
  </Card>
</template>
<script>
import DeptApi from '@/api/base/dept'
// import PickTree from '_c/tables/pick-tree'
import PickTree from './pick-tree'

export default {
  name: 'DeptTree',
  components: {
    PickTree
  },
  props: {
  },
  data () {
    return {
      deptData: [],
      deptTreeLabelKey: 'deptName',
      deptTreeValueKey: 'code',
      deptCode: ''
    }
  },
  watch: {
  },
  mounted () {
    DeptApi.list().then(res => {
      const list = res.data.data
      this.deptData = list
    })
  },
  methods: {
    onSelectDeptChange (node) {
      if (typeof node !== 'undefined') this.deptCode = node.value
      else this.deptCode = ''
      this.$emit('on-dept-change', this.deptCode)
    },
    refreshDeptList () {
      DeptApi.list().then(res => {
        const list = res.data.data
        this.deptData = list
      })
    }
  }
}
</script>
